<template>
  <div class="supplierFileUpload">
    <el-upload
      ref="upload"
      class="upload-demo"
      :action="uploadUrl"
      :data="{
        typeId: fileItem.id,
        id: type === 'edit' ? this.$attrs.current.id : null
      }"
      :on-success="handleAvatarSuccess"
      :on-preview="handlePreview"
      :on-remove="handleRemove"
      :before-remove="beforeRemove"
      multiple
      :limit="1"
      :file-list="fileList"
    >
      <el-button size="small">
        <i class="el-icon-upload2" style="margin-right: 4px; font-size: 14px" />
        点击上传
      </el-button>
    </el-upload>
  </div>
</template>

<script>
export default {
  name: 'SupplierFileUpload',
  props: {
    fileItem: {
      type: Object,
      default: () => []
    },
    fileList: {
      type: Array,
      default: () => []
    },
    type: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      uploadUrl: process.env.VUE_APP_BASE_API + 'vue/files/upload'
    }
  },
  mounted() {},
  methods: {
    handleRemove(file, fileList) {
      this.fileList.splice(0, 1)
    },
    handlePreview(file) {
      console.log(file)
    },
    beforeRemove(file, fileList) {
      return this.$confirm(`确定移除 ${file.name}？`)
    },
    handleAvatarSuccess(res, file) {
      this.$parent.clearValidate()
      this.fileList.push(res)
      // this.$emit('annexUploadSuccess', file, this.fileItem)
    }
  }
}
</script>

<style lang="less" scoped>
.supplierFileUpload {
  height: 99%;
}
</style>
